<template>
<view>
<!-- <loading v-if="!show">加载中...</loading> -->
<view class="page navbar" v-if="show">
    <view class="fui-list-group" id="container">
        <view class="fui-list goods-item align-start" :data-goodsid="item.goodsid" v-for="(item, index) in packgoods" :key="index">
            <view class="fui-list-media image-media">
                <image @tap="back" class="package-goods-img" :data-id="item.goodsid" :src="item.thumb"></image>
            </view>
            <view class="fui-list-inner">
                <view @tap="back" class="text towline" :data-id="item.goodsid">{{item.title}}</view>
                <view class="text cart-option cartmode">
                    <span @tap="optionFun" class="option" :data-goodsid="item.goodsid" :data-index="index" v-if="item.option!=''">{{item.optionname?item.optionname:'请选择规格 >'}}</span>
                </view>
            </view>
            <view class="fui-list-angle">
                <span class="price">
                    <span class="marketprice">¥{{item.packageprice}}</span>
                </span>
                <span class="price" style="justify-content: flex-end">
                    <span class>x1</span>
                </span>
            </view>
        </view>
    </view>
    <view class="fui-navbar bottom-buttons">
        <view class="nav-item packagePrice">
            <view class="subtitle">套餐价格：<span class="text-danger bigprice">¥</span>
                <span class="text-danger totalprice  bigprice">{{sum?sum:package.price}}</span>
            </view>
        </view>
        <view @tap="buy" class="nav-item btn buybtn">立刻购买</view>
    </view>
    <!-- <view :class="'fui-toast ' + (FoxUIToast.show?'in':'out')">
        <view class="text">{{FoxUIToast.text}}</view>
    </view> -->
    <view @tap="close" class="option-mask" v-if="option_mask"></view>
    <view class="option-picker" v-if="option_mask">
        <view class="fui-cell-group fui-sale-group" style="margin-top:0;">
            <view class="fui-cell">
                <view class="fui-cell-text dispatching">请选择规格:<view class="dispatching-info">
                        <i @tap="choose" :class="'package-i ' + (option_active==item.optionid?'active':'')" :data-goodsid="item.goodsid" :data-index="index" :data-optionid="item.optionid" :data-price="item.packageprice" :data-title="item.title" v-for="(item, index) in option" :key="index">{{item.title}}</i>
                    </view>
                </view>
            </view>
            <view @tap="confirm" class="btn btn-danger block">确定</view>
        </view>
    </view>
    <menus :route='route' :icons="icons" :cartcount="cartcount"></menus>
	<tpl_detail_package></tpl_detail_package>
</view>
</view>
</template>

<script>
var t = getApp().globalData,
    o = t.requirejs("core"),
    a = (t.requirejs("icons"), t.requirejs("jquery"), t.requirejs("foxui"));
import menus from "@/pages/common/menu.vue"
export default {
  data() {
    return {
      show: 1,
      option_mask: !1,
      pid: "",
      packgoods: "",
      package: "",
      good: "",
      option: "",
      index: "",
      option_active: "",
      option_title: "",
      sum: "",
	  icons: {},
	  cartcount: ''
    };
  },
  components: {menus},
  props: {},
  onLoad: function (t) {
    var a = this;
    a.setData({
      pid: t.id
    }), o.get("package.get_detail", {
      pid: t.id
    }, function (t) {
      var o = t.packgoods,
          i = [];
      wx.setNavigationBarTitle({
        title: t.package.title || "套餐"
      });

      for (var e = 0; e < o.length; e++) "" == o[e].option ? i[e] = {
        goodsid: o[e].goodsid,
        optionid: ""
      } : i[e] = {
        goodsid: o[e].goodsid,
        optionid: null
      };

      a.setData({
        packgoods: o,
        package: t.package,
        good: i,
      });
    });
  },
  onReady: function () {},
  onShow: function () {},
  onHide: function () {},
  onUnload: function () {},
  onPullDownRefresh: function () {},
  onReachBottom: function () {},
  onShareAppMessage: function () {},
  methods: {
    optionFun: function (t) {
      var a = this,
          i = t.currentTarget.dataset.goodsid,
          e = t.currentTarget.dataset.index;
      o.get("package.get_option", {
        pid: a.pid,
        goodsid: i
      }, function (t) {
        a.setData({
          option_mask: !0,
          option: t.option,
          index: e
        });
      });
    },
    back: function (t) {
      wx.setStorage({
        key: "mydata",
        data: {
          id: t.currentTarget.dataset.id
        },
        success: function () {
          wx.navigateBack();
        }
      });
    },
    close: function () {
      this.setData({
        option_mask: !1
      });
    },
    choose: function (t) {
      var o = t.currentTarget.dataset.optionid,
          a = t.currentTarget.dataset.title,
          i = t.currentTarget.dataset.index,
          e = this.packgoods,
          n = this.option[i].packageprice;
      e[this.index].packageprice = n;

      for (var d = 0, s = 0; s < e.length; s++) d += 1 * e[s].packageprice;

      this.setData({
        option_active: o,
        option_title: a,
        sum: d
      });
    },
    confirm: function () {
      var t = this.packgoods,
          o = this.index,
          a = this.option_active,
          i = this.option_title,
          e = this.good;
      t[o].optionname = i, e[o].optionid = a, this.setData({
        option_mask: !1,
        packgoods: t,
        good: e
      });
    },
    buy: function () {
      for (var t = this.good, o = !0, i = 0; i < t.length; i++) null == t[i].optionid && (o = !1);
      o ? (t = JSON.stringify(t), wx.redirectTo({
        url: "/pages/order/create/index?packageid=" + this.package.id + "&goods=" + t
      })) : a.toast(this, "请选择规格！");
    }
  }
};
</script>
<style>
@import "./index.css";
</style>